<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
    />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <title>订货记录</title>

    <style>
        body {
            background: #FFFFFF;
        }

        .title {
            display: flex;
            border-bottom: 0.5px solid #e6e6e6;
        }

        .time_title {
            padding: 0.5rem;
            background-color: #f2f2f2;
        }

        .list_item {
            position: relative;
            height: 5rem;
            display: flex;
        }

        .list_img {
            width: 4rem;
            margin: 0.5rem;
        }

        .list_text {
            width: 4rem;
            display: flex;
            justify-content: space-between;
            flex-direction: column;
            flex: 2;
            margin-top: 0.5rem;
            word-wrap: break-word;
            margin-right: 0.5rem;
            padding-bottom: 0.5rem;
        }

        .list_text_flex {
            display: flex;
            justify-content: space-between;
            color: #999999;
        }

        .list_btn {
            text-align: right;
            padding: 0 0.5rem 0.5rem 0.5rem;
        }

        .goodsList li {
            border-bottom: 1px solid #ddd;
        }

        .btn {
            display: inline-block;
            width: 4rem;
            height: 1.4rem;
            line-height: 1.4rem;
            border-radius: 2px;
            color: #5f647a;
            font-size: 0.65rem;
            font-weight: 300;
            border: solid 1px #5f647a;
            background-color: #ffffff;
            margin-left: 0.4rem;
            text-align: center;
        }

        .clearfix:after {
            content: ".";
            display: block;
            height: 0;
            clear: both;
            visibility: hidden
        }

        .boutiqueName {
            display: flex;
            justify-content: space-between;
        }

        .authstr {
            color: red;
        }

        .bottom {
            text-align: center;
        }
    </style>
</head>

<body>
    <!-- 头部  s -->
    <header class="aui-bar aui-bar-nav aui-bar-light" style="background: #4e536c;">
        <a class="aui-pull-left aui-btn" onclick="goToMainPage()">
            <span class="aui-iconfont aui-icon-left" style="color: #FFFFFF;"></span>
        </a>
        <div class="aui-title" style="color: #FFFFFF;">订货记录</div>
    </header>
    <div class="content">
        <div class="list">
            <ul class="goodsList">
                <template id="list">
                    {{each result as value}}
                    <li>
                        <!--<div class="time_title">今日</div>-->
                        <div class="list_item ">
                            <div class="list_img">
                                <img alt="" class="img_bg" src="{{value.productIcon}}">
                            </div>
                            <div class="list_text">
                                <div class="boutiqueName">
                                    <span style="flex: 2">{{value.boutiqueName}}</span>
                                    {{if value.orderState == 0}}
                                    <span class="authstr">待审核</span>
                                    {{else if value.orderState == 1}}
                                    <span class="authstr">待出货</span>
                                    {{else if value.orderState == 2}}
                                    <span class="authstr">审核失败</span>
                                    {{/if}}
                                </div>
                                <div class="list_text_flex">
                                    <div class="aui-font-size-12">
                                        下单时间：
                                        <span class="time">
                                            {{value.createTime}}
                                        </span>
                                    </div>
                                    <div class="aui-font-size-12">
                                        *
                                        <span class="num">{{value.boutiqueAmount}}</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {{if value.orderState == 3}}
                        <div class="list_btn" data-id="{{value.shipmentOrderId}}" data-shipSn="{{value.shipSn}}" data-shipCode="{{value.shipCode}}"
                            data-img="{{value.productIcon}}">
                            <a class="btn">已出货</a>
                            <a class="btn logistic">查看物流</a>
                            <p></p>
                        </div>
                        {{/if}}
                    </li>
                    {{/each}}
                </template>
            </ul>
        </div>
    </div>
    <div class="bottom ">---------我们是有底线的---------</div>


    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
    <script src="../js/comment.js"></script>
    <script src="../js/template.js"></script>
    <script src="../js/aui-toast.js"></script>
    <script>
        var obj = JSON.parse(window.localStorage.getItem('obj'));
        // var obj = {
        //     storeId: '10373'
        // }
        window.onload = function () {
            var toast = new auiToast({})
            var curpage = 1;
            var data = {
                storeId: obj.storeId,
                currentPage: curpage,
                showCount: 6,
            }
            showDefault('loading')
            load(data, curpage)

            function load(data, curpage) {
                var pages = data.currentPage;

                $.ajax({
                    type: 'post',
                    url: url + 'shipment/order/list/info',
                    data: data,
                    success: function (res) {
                        if (res.code == 200 && res.datas.result.length != 0) {
                            if (pages > res.datas.totalPage) {
                                toast.hide();
                                $('.bottom').show();
                                return;
                            } else {
                                $('.bottom').hide();
                                toast.hide();
                                var res = res.datas;
                                var html = template('list', res);
                                $('.goodsList').append(html);
                            }
                        } else {
                            showDefault('loading');
                            setTimeout(function () {
                                window.location.href = 'empty.html';
                            }, 2000)
                        }
                    },
                    error: function (err) {
                        toast.hide()
                    }
                })


            }

            function showDefault(type) {
                switch (type) {
                    case "loading":
                        toast.loading({
                            title: "加载中",
                            duration: 2000
                        }, function (ret) {

                        });
                        break;

                }
            }
            $(window).scroll(function () {
                var doc_height = $(document).height();
                var scroll_top = $(document).scrollTop();
                var window_height = $(window).height();
                if (scroll_top == 0) {
                } else if (scroll_top + window_height >= doc_height) {
                    data.currentPage++;
                    load(data, curpage);
                }
            });
        }

        $('.goodsList').on("click", ".logistic", function (e) {
            var data = JSON.stringify($(this).parent().data());
            window.localStorage.setItem('dataMsg', data)
            openNewPage('logistics.html');

        })

        function openNewPage(url) {
            if (isAndroid()) {
                window.WebViewJavascriptBridge.callHandler(
                    'openNewPage', {
                        'param': url
                    },
                    function (responseData) { }
                );
            } else if (isIOS()) {
                window.location.href = url
            } else {
                window.location.href = url
            }
        }

        function goToMainPage() {
            location.href = 'boutique.html'
            // window.WebViewJavascriptBridge.callHandler(
            //     'goToMainPage', {
            //         'param': 'aaaaa'
            //     },
            //     function(responseData) {
            //         alert(responseData);
            //     }
            // );
        }
    </script>

</body>

</html>